<template>
  <div class="breadcrumb-wrap">
    <div class="pre-wrap">
      <a-icon type="environment" />
      <span class="locationText">您当前所在的位置：</span>
    </div>
    <a-breadcrumb separator=">">
      <a-breadcrumb-item v-for="(item, index) in options" :key="item.name" >
        <span @click="toPath(item, index)" class="crumbItem">{{item.name}}</span>
      </a-breadcrumb-item>
    </a-breadcrumb>
  </div>
</template>

<script>
export default {
  props: {
    options: Array
  },
  data() {
    return {

    }
  },
  mounted() {

  },
  methods: {
    toPath(instance, index) {
      const preList = this.options.slice(0, index)
      let toRouter = ''
      if (preList.length > 0) {
        preList.forEach((item) => {
          toRouter += `/${item.toRouter}` // 获取前面路由
        })
      }
      toRouter += `/${instance.toRouter}` // 组合当前点击
      const currentRouter = this.$route.path
      if (currentRouter === toRouter) return // 如果点击当前路由直接退出
      this.$router.push(toRouter)
    }
  }
}
</script>
